<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			*{
				padding: 0;
				margin: 0;
			}
			.xiaomi{
				width: 240px;
				height: 300px;
				/*border: 1px solid blue;*/
				color:#FFFFFF ;
				margin:0  auto;
				position: relative;
			}
			.xiaomi:hover{
				border: 1px solid blue;
			}
			.xiaomi img{
				left: 45px;
				top: 40px;
				position: absolute;
			}
			.xiaomi .bazhe{
				width: 64px;
				height: 20px;
				line-height: 20px;
				font-size: 12px;
				font-family: "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;
				color: red;
				text-align: center;
				left: 87px;
				top: 0;
				color: #fff;
				background: #e53935 ;
				position: absolute;
				display: block;
			}
			.xiaomi .gangpao{
				text-decoration: none;
				font-size: 14px;
				font-weight: 400;
				font-family: "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;
			    left: 53px;
			    top: 205px;
			    color: #333;
			    position: absolute;
			}
			.xiaomi .price{
				font-size:14px;
				font-family:"Helvetica Neue",Helvetica,Arial,"Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif; ;
			    color: #ff6700;
			    left:80px;
			    bottom:55px;
			    position: absolute;
			}
			.xiaomi .old_price{
				font-size:14px;
				font-family:"Helvetica Neue",Helvetica,Arial,"Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif; ;
			    color: #b0b0b0;
			    right:89px;
			    bottom:55px;
			    text-decoration: line-through;
			    position: absolute;
			}
			.xiaomi .rank{
				font-size: 12px;
				font-family: "Helvetica Neue",Helvetica,Arial,"Microsoft Yahei","Hiragino Sans GB","Heiti SC","WenQuanYi Micro Hei",sans-serif;
			    line-height: 20px;
			    color: #b0b0b0;
			    left: 87px;
			    bottom: 15px;
			    position: absolute;
			    
			}
		</style>
	</head>
	<body>
		<div class="xiaomi">
			<span class="bazhe">享8折</span>
			<a href=""><img src="xiaomi.jpg"/></a>
			<a class="gangpao" href="">小米小钢炮蓝牙音箱2</a>
			<span class="price">99元</span>
			<span class="old_price">129元</span>
			<p class="rank">1.1万人评价</p>
		</div>
	</body>
</html>
